// PolyTool.js
import { cloneDeep } from 'lodash';
import LabelConfig from '@/js/models/LabelConfig';

class PolyTool {
    constructor(canvas) {
        this._canvas = canvas;
        this._poly_points = [];
        this._poly_tmp = null;
        this._poly_lt = null;
        this._closed = true;
        this._callback = null;
    }

    setImage(image) {
        this._image = image;
    }

    setCallback(callback) {
        this._callback = callback;
    }

    onMouseDown(event) {
        let px = event.absolutePointer.x;
        let py = event.absolutePointer.y;
        let newpt = { x: px, y: py };

        this._closed = false;
        this._poly_points.push(newpt);
        if (!this._poly_lt) {
            this._poly_lt = {
                left: newpt.x,
                top: newpt.y
            };
        } else {
            if (newpt.x < this._poly_lt.left) {
                this._poly_lt.left = newpt.x;
            }
            if (newpt.y < this._poly_lt.top) {
                this._poly_lt.top = newpt.y;
            }
        }

        // render tmp polygon object on canvas
        if (this._poly_points.length == 1) {
            this._poly_tmp = new fabric.Polyline(this._poly_points, {
                left: this._poly_points[0].x,
                top: this._poly_points[0].y,
                fill: LabelConfig.getConfig('polygon_style.fill'),
                strokeWidth: LabelConfig.getConfig('polygon_style.strokeWidth'),
                stroke: LabelConfig.getConfig('polygon_style.stroke'),
                cornerColor: 'blue',
                objectCaching: false,
                hasControls: false,
                hasBorders: false
            });
            this._canvas.add(this._poly_tmp);
        } else if (this._poly_points.length > 1) {
            this._poly_tmp.set({
                points: this._poly_points
            });
        }
    }

    onMouseMove(event) {
        if (this._poly_points.length >= 1) {
            let px = event.absolutePointer.x;
            let py = event.absolutePointer.y;
            let newpt = { x: px, y: py };

            let tmp_points = cloneDeep(this._poly_points);
            tmp_points.push(newpt);
            this._poly_tmp.set({
                points: tmp_points
            });
        }
    }

    handleKeyDown(event) {
        let key = event.key.toLowerCase();
        if (key == 'f') {
            this.finish();
        } else if (key === 'escape') {
            this.clear();
        }
    }

    // 完成当前编辑
    finish() {
        if (this._poly_tmp) {
            // 清除临时的polyline对象
            this._canvas.remove(this._poly_tmp);
            this._canvas.renderAll();

            // 调用回调函数，新增一个rect标注结果
            this._callback({
                left: this._poly_lt.left,
                top: this._poly_lt.top,
                points: this._poly_points
            });
        }

        this._poly_points = [];
        this._poly_tmp = null;
        this._poly_lt = null;
        this._closed = true;
    }

    // 取消当前编辑
    clear() {
        if (this._poly_tmp) {
            // 清除临时的polyline对象
            this._canvas.remove(this._poly_tmp);
            this._canvas.renderAll();
        }

        this._poly_points = [];
        this._poly_tmp = null;
        this._poly_lt = null;
        this._closed = true;
    }
}

export default PolyTool;
